﻿Vue.component('sys-enumcode-edit', {
    data: function () {
        return {
            popVisible: this.visible,
            modelData: this.model,
        };
    },
    props: {
        visible: {
            type: Boolean,
            default: false
        },
        vresult: {
            type: Boolean,
            default: false
        },
        vname: {
            type: String
        },
        model: {
            type: Object
        },
        cls: {
            type: String,
            default: "sys-enumcode-edit"
        }
    },
    watch: {
        'vresult': function (newVal) {
            if (newVal) {
                this.doSubmit();
            }
        },
        "model": function (newVal) {
            newVal = newVal || {};
            this.modelData = newVal;
        }
    },
    methods: {
        handleSubmit: function (e) {
            var $form = $(e.currentTarget).parents('form');
            $form.submit();
        },
        doSubmit: function () {
            var self = this;
            var paramData = Object.assign({}, this.modelData, {
                Sort: this.modelData.Sort || 0
            });
            this.$emit('complete', { result: "SUBMIT", model: paramData });
        },
        doCancel: function () {
            this.popVisible = false;
            this.$emit('complete', { result: 'CANCEL' });
        }
    },
    computed: {
        debug: function () {
            return /\/\/localhost|\/\/127.0.0.1/i.test(location.href) || /[\?&]debug=true/.test(location.search);
        }
    },
    mounted() {
    },
    filters: {
    },
    template: '<div class="windLayerDiv" :class="`${cls}`"  style="display: none;" v-show="popVisible">\
		<table class="windLayerHeadingULine table100" cellpadding="3" cellspacing="0" >\
		<tr class="windLayerHeadingTr">\
			<td width="80%" style="cursor: move;" class="windLayerHeading" align="left">\
				编辑分类信息\
			</td>\
			<td align="right">\
				<input class="windLayerBtclose" type="button" title="关闭" @click.prevent="doCancel">&nbsp;&nbsp;\
			</td>\
		</tr>\
	</table>\
		<form class="validation-engine" :data-validate="vname">\
			<table style="background-color: rgb(234, 234, 234);width:100%;" class="small" border="0" cellpadding="3" cellspacing="1">\
			<tr bgcolor="white" height="25px;" style="">\
				<td class="windLayerTitle" style="text-align:right;">\
					上级分类\
				</td>\
				<td class="windLayerInfo" style="">\
					<input type="text" v-model="modelData.PName" class="" autocomplete="off" style="width:90%;" placeholder="" />\
				</td>\
			</tr>\
			<tr bgcolor="white" height="25px;" style="">\
				<td class="windLayerTitle" style="text-align:right;width:30%;">\
					<span style="color:#f00;">*</span>分类名称\
				</td>\
				<td class="windLayerInfo" style="width:70%;">\
					<input type="text" v-model="modelData.Name" autocomplete="off" class="validate[required]" style="width:90%;" placeholder="" />\
				</td>\
			</tr>\
			<tr bgcolor="white" height="25px;" style="">\
				<td class="windLayerTitle" style="text-align:right;">\
					分类编号\
				</td>\
				<td class="windLayerInfo" style="">\
					<input type="text" v-model="modelData.Code" class="" autocomplete="off" style="width:90%;" placeholder="" />\
				</td>\
			</tr>\
			<tr bgcolor="white" height="25px;" style="">\
				<td class="windLayerTitle" style="text-align:right;">\
					排序\
				</td>\
				<td class="windLayerInfo" style="">\
					<input type="number" v-model="modelData.Sort" class="" autocomplete="off" style="width:90%;" placeholder="值越小越靠前，可以不输" />\
				</td>\
			</tr>\
			<tr bgcolor="white" height="40px;">\
					<td colspan="2" align="center">\
						<button type="button" class="pure-button pure-button-edit" @click.prevent="handleSubmit($event)">\
							<i class="icon-check"></i>确定\
						</button>\
						&nbsp;&nbsp;&nbsp;&nbsp;\
						<button type="button" class="pure-button" @click.prevent="doCancel">\
							<i class="icon-reply"></i>取消\
						</button>\
						&nbsp;\
					</td>\
				</tr>\
			</table>\
		</form>\
		<div class="windLayerFoot">\
			&nbsp;\
	</div>\
		<div class="windLayerCorner">\
			&nbsp;\
	</div>\
</div>'
});